LoadCartList();
/* 查询用户购物车中的商品 接口

    接口地址：http://jx.xuzhixiang.top/ap/api/cart-list.php
    接口请求方式：get
    接口参数：
         id  用户id
    使用方式
         获取id为1的用户的购物车
         http://jx.xuzhixiang.top/ap/api/cart-list.php?id=1 */

async function LoadCartList() {
  let cartListAPI = "http://jx.xuzhixiang.top/ap/api/cart-list.php";
  let id = localStorage.getItem("id");
  /* console.log(id); */
  let res = await axios.get(cartListAPI, { params: { id: id } });
  /* console.log(res.data); */
  let CataArr = res.data.data;
  /* console.log(CataArr); */
  let resArr = CataArr.map(
    (v) =>
      `<div class="item-box">
      <div class="item-table">
        <div class="item-row clearfix">
          <div class="col col-check">
            <input class="fa fa-check single-Select" type="checkbox" onchange="singleSelect(${
              v.pid
            },this)"/>
          </div>
          <div class="col col-img">
            <a href="">
              <img src="${v.pimg}" alt="" />
            </a>
          </div>
          <div class="col col-name">
          <div class="tags"></div>
          <div class="tags"></div>
            <h3 class="name">
              <a href="#">${v.pname}</a>
            </h3>
          </div>
          <div class="col col-price">${v.pprice}</div>
          <div class="col col-num">
          <div class="change-goods-num">
            <input class="fa fa-minus" type="button"  value="-" data-id="${
              v.pid
            }" onclick="num_jian(${v.pid},this)" >
            <input type="text" min="1" autocomplete="off" class="goods-num" onchange="numChange(${
              v.pid
            },this)" value="${v.pnum}"/>
            <input class="fa fa-plus" type="button" value="+" data-id="${
              v.pid
            }" onclick="num_jia(${v.pid},this)">
          </div>
        </div>
        <div class="col col-total">${v.pprice * v.pnum}</div>
        <div class="col col-action">
          <input onclick=" delCart(${v.pid},this)" type="button" value="删除" />
        </div>
      </div>
    </div>
  </div>`
  );
  // console.log(resArr);
  let ul = document.querySelector(".list-item");
  ul.innerHTML = resArr;
}
/* 接口地址：http://jx.xuzhixiang.top/ap/api/cart-update-num.php
接口请求方式：get
接口参数：
     uid  用户id
     pid  商品id
     pnum  要添加的商品数量
使用方式
    http://jx.xuzhixiang.top/ap/api/cart-update-num.php?uid=1&pid=1&pnum=1 */
/* let ipts=document.querySelectorAll(".goods-num");
    for(let i=0;i<ipts.length;i++){
    console.log(ipts[i]);
    ipts[i].value.onchange=function(pid,){
      console.log(ipts[i].value);
      let updateCartNumAPI =
          "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
      let pnum = this.value;
    }
    } */

// btn.onclick = function(){}
// 删除功能
/*
        删除用户购物车中的商品 接口

      接口地址：http://jx.xuzhixiang.top/ap/api/cart-delete.php
      接口请求方式：get
      接口参数：
           uid  用户id
           pid  商品id
        */

async function num_jia(pid, ipt) {
  console.log(pid);
  console.log(ipt);
  let numb = ipt.previousElementSibling.value;
  numb = Number(numb) + 1;
  let updateCartNumAPI = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
  let pnum = numb;
  let uid = localStorage.getItem("id");
  let params = { pnum, pid, uid };
  console.log(params);
  let res = await axios.get(updateCartNumAPI, { params });
  console.log(ipt.previousElementSibling.value);
  console.log(res.data);
  calCountPrice();
  LoadCartList();
}
async function num_jian(pid, ipt) {
  console.log(pid);
  console.log(ipt);
  let numb = ipt.nextElementSibling.value;
  if (numb > 1) {
    numb = Number(numb) - 1;
  } else {
    numb = 1;
  }
  let updateCartNumAPI = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
  let pnum = numb;
  let uid = localStorage.getItem("id");
  let params = { pnum, pid, uid };
  console.log(params);
  let res = await axios.get(updateCartNumAPI, { params });
  console.log(res.data);
  calCountPrice();
  LoadCartList();
}

async function delCart(pid, btn) {
  console.log(pid);
  let uid = localStorage.getItem("id");
  let delCartAPI = "http://jx.xuzhixiang.top/ap/api/cart-delete.php";
  let res = await axios.get(delCartAPI, { params: { uid, pid } });
  console.log(res.data);
  calCountPrice();
  LoadCartList();
  /* console.log(this);
btn.parentNode.parentNode.remove(); */
}

let uid = localStorage.getItem("id");
let pid = localStorage.getItem("pid");
console.log(pid);
console.log(uid);
async function numChange(pid, ipt) {
  console.log(ipt.value, pid);
  let updateCartNumAPI = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
  let pnum = ipt.value;
  console.log(pnum);
  console.log(localStorage.getItem);
  let uid = localStorage.getItem("id");
  console.log(uid);
  let params = { pnum, pid, uid };
  console.log(params);
  let res = await axios.get(updateCartNumAPI, { params });
  console.log(res.data);
  LoadCartList();
}
function singleSelect(pid, ipt) {
  console.log(ipt.checked);
  let facheckArr = document.querySelectorAll(".single-Select");
  console.log(facheckArr);
  calCountPrice();
  let arr = [...facheckArr];
  let isAllchecked = arr.every(function (v) {
    return v.checked === true;
  });
  console.log(isAllchecked);
  document.querySelector(".all-sel").checked = isAllchecked;
}
function allselChange(ipt) {
  console.log(ipt.checked);
  let facheckArr = document.querySelectorAll(".single-Select");
  facheckArr.forEach((v) => (v.checked = ipt.checked));
  calCountPrice();
}
function calCountPrice() {
  let facheckArr = document.querySelectorAll(".single-Select");
  let count = 0;
  let countprice = 0;
  facheckArr.forEach((ipt) => {
    if (ipt.checked == true) {
      console.log(ipt);
      let currentLi = ipt.parentNode.parentNode; // nextElementSibling.nextElementSibling.nextElementSibling;
      console.log(currentLi);
      let p_prices = currentLi.children[3];
      let p_price = p_prices.innerHTML;
      console.log(p_price);
      let p_num = currentLi.querySelector(".goods-num").value;
      console.log(p_num);
      let currentCount = p_price * Number(p_num);
      count = count + Number(p_num);
      countprice += currentCount;
    }
  });
  console.log(count, countprice);
  let countsum = document.querySelector(".cart-total");
  countsum.children[0].innerHTML = count;
  let countsumP = document.querySelector(".total-price");
  countsumP.children[0].innerHTML = countprice;
}
